window.onload = function () {
    createCode(4);
}
var checkCode = document.querySelector(".vcode");
var btn = document.querySelector(".login-btn");
var errorDiv = document.querySelector(".errorMsg");
checkCode.onclick = function () {
    createCode(4);
}
//生成验证码
function createCode(length) {
    var code = "";
    var codeLength = parseInt(length);
    var checkCode = document.querySelector(".vcode");

    var codeChars = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9,
        'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z',
        'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z');
    for (var i = 0; i < codeLength; i++) {
        //获取随机验证码下标
        var charNum = Math.floor(Math.random() * 62);
        //组合成指定字符验证码
        code += codeChars[charNum];
    }
    if (checkCode) {
        //将生成验证码赋值到显示区
        checkCode.innerHTML = code;
    }
}
//点击下一步
btn.onclick = function () {
    validateCode();
}
function validateCode() {
    var inputCode = document.getElementById("vcode-in").value.toUpperCase(); // 获取输入的验证码并转换为大写
    var errorDiv = document.getElementById("errorMsg");

    if (inputCode.length <= 0) { // 如果输入的验证码为空
        errorDiv.innerHTML = "请输入验证码"; // 显示错误信息
    } else if (inputCode !== codeToCheck) { // 如果输入的验证码与显示的验证码不匹配
        errorDiv.innerHTML = "验证码输入错误"; // 显示错误信息
        createCode(4); // 重新生成验证码
    } else { // 如果验证码匹配
        errorDiv.innerHTML = ""; // 清除错误信息
        // 这里可以写上验证成功后的操作，比如提交表单等
        alert("验证码正确，可以进行下一步操作");
    }
}